<template>
	<view class="all">
		<view class="title">
			{{item.ProcedureName}}
		</view>

		<view class="record" v-for="i in records">
			<image :src="'http://localhost:5099/wwwroot/images/' + i.WorkPict" mode=""></image>
			<view class="record-info">
				<span class="desc">
					{{ i.WorkDesc }}
				</span>
				<span>
					{{ i.CreateTime }}
				</span>
			</view>

		</view>
		<view class="btn">
			<van-button plain hairline type="primary" size="small" 
			v-if="item.CheckStatus!=2&&item.Status==2" @click="handleCheck">通过</van-button>
			<van-button plain hairline type="warning" size="small" class="btn-warning"
			v-if="item.CheckStatus!=2&&item.Status==2" @click="handleReject">驳回</van-button>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted
	} from 'vue'
	import userprocedureRecordApi from "../../api/userprocedureRecordApi"
	import userprocedureapi from "../../api/userprocedureapi"
	import {
		Logger
	} from 'sass';
	import { showSuccessToast, showFailToast } from 'vant';
	const item = ref();
	const records = ref()
	const userProcedures = ref([]);
	const props = defineProps({
		navigator: Object
	});
	item.value = JSON.parse(props.item)
	console.log("11", item.value)

	// 获取工序记录
	const getRecord = (id) => {
		userprocedureRecordApi.getByProcedure(id).then(res => {
			records.value = res.data;
		})
	}

		getRecord(item.value.Id);

	// 验收
	const handleCheck = () => {
		item.value.CheckStatus = 2;
		userprocedureapi.accept(item.value.Id).then(res => {
			if (res.code == 1) {
				showSuccessToast('成功');
			} else {
				showFailToast('失败');
			}

			let item = userProcedures.value.find(o => o.CheckStatus != 2);
			console.log("111", userProcedures.value);
			console.log(item);


			if (item === undefined) {
				showSuccessToast('项目已完成');
			}
		});
	}

	// 驳回
	const handleReject = () => {
		console.log(item.value.Id);
		userprocedureapi.reject(item.value.Id).then(res => {
			item.value.Status = 1;
			if (res.code == 1) {
				showSuccessToast('驳回成功');
			} else {
				showFailToast('失败');
				
			}
		})
	}
	onMounted(() => {
		getRecord(item.value.Id)
	})
</script>

<style scoped>
	.title {
		margin: 10px 20px;
	}

	.record {
		width: 90%;
		margin: 10px auto;
		display: flex;
		background-color: var(--el-color-info-light-9);
		box-sizing: border-box;
		padding: 10px;
		border-radius: 8px;
		background-color: rgb(230, 230, 230);
	}

	.desc {
		font-size: 14px;
	}

	.record>image {
		width: 80px;
		height: 80px;
	}

	.record-info {
		flex-grow: 1;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding: 0 10px;
	}

	.record-info>:last-child {
		align-self: flex-end;
	}

	.btn {
		display: flex;
		margin: 20px;
		justify-content: flex-end;
	}

	.van-button {
		width: 60px;
		margin: 5px;
	}
</style>